@charset "utf-8";
/**
 * Yo框架全局Variables
 -----------------------
 * Yo基础变量map，如果不想定义某属性，将其value设置为null；
 * Yo仅使用2种长度单位：px用于边框，rem用于除边框之外的所有地方
 *
 * @class variables
 * @module Yo
 */

$setting: (
    // 版本号
    version:          "1.8.2",
    // 是否开启厂商前缀
    is-vendor-prefix: true,
    // 厂商前缀
    vendor-prefix:    -webkit-,
    // 是否开启iOS 1px方案
    is-ios-1pixel:    false,
    // 背景图片服务器
    bgimg-domain:     "http://source.qunarzz.com/yo/bgimg/"
) !default;

// base
$base: (
    // 响应式的类型：none | scaling
    responsive-type:        none,
    // html root使用100px，方便rem单位的换算
    font-size-root:         100px,
    // 适配：用于做元素随屏幕大小而变化的情况
    font-size-root-scaling: 31.25vw,
    // body的默认字体
    // chrome37.0.2062.120/opera24在body上使用rem时有个bug（其他版本未测）:
    // 只要引用了外部样式，不论里面的内容是什么，body上的rem就会失效
    // 这时在开发者工具里，关闭又开启一次该条属性，则生效，刷新又挂
    // 所以这里注释该条属性，默认字号不能从root相对而来，所以定义成px
    font-size:            14px,
    // font-family
    // escape('微软雅黑').replace(/\%u/g,'\\').toLowerCase()
    font-family:          #{"Helvetica Neue", Helvetica, STHeiTi, sans-serif},
    // lin-height
    line-height:          1.5,
    // 默认文档背景色
    doc-bgcolor:          #fafafa,
    // 默认边框色
    bordercolor:          #ccc,
    // 默认次级边框色
    sub-bordercolor:      #ddd,
    // 默认背景颜色
    bgcolor:              #fafafa,
    // 默认文本颜色
    color:                #212121,
    // 默认次级文本颜色
    sub-color:            #666,
    // 默认边框色
    disabled-bordercolor: #ccc,
    // 默认文档颜色
    disabled-bgcolor:     #e0e0e0,
    // 默认禁用文本颜色
    disabled-color:       #bbb,
    // 高亮色
    light-color:          #FE0053,
    // 价格颜色
    price-color:          #f60,
    // Link Colors
    // 默认链接色
    link-color:           #00afc7,
    // 链接经过色
    link-hover-color:     #f60
) !default;

// responsive media types
$media-types: (
    // {String} 横屏
    landscape: "screen and (orientation: landscape)",
    // {String} 竖屏
    portrait:  "screen and (orientation: portrait)",
    // {String} 视网膜屏2x
    retina2x:  "(min--moz-device-pixel-ratio: 1.5),
                (-webkit-min-device-pixel-ratio: 1.5),
                (min-device-pixel-ratio: 1.5),
                (min-resolution: 144dpi),
                (min-resolution: 1.5dppx)",
    // {String} 视网膜屏3x
    retina3x:  "(min--moz-device-pixel-ratio: 2.5),
                (-webkit-min-device-pixel-ratio: 2.5),
                (min-device-pixel-ratio: 2.5),
                (min-resolution: 240dpi),
                (min-resolution: 2.5dppx)",
    // {String} PC
    pc:        "(min-width: 8rem)",
    // {String} mobile
    mobile:    "(max-width: 7.99rem)"
) !default;

// ico font
$ico: (
    // {Boole} 是否使用图标字体
    is-use:     true,
    // {String} 图标字体文件名
    font-name:  yofont,
    // {Url} 图标字体路径
    font-path:  "http://source.qunarzz.com/fonts/yo/1.0.0/"
) !default;

// Layout Stacked
$stacked: (
    // {Length} 区块外边距
    margin: .2rem .1rem
) !default;

// Layout flex
$flex: (
    // {String} 定义弹性布局: flex |inline-flex
    box: flex,
    // {String} 定义是水平布局还是垂直布局: row | column
    direction: column
) !default;

// Layout align
$align: (
    // {String} 定义弹性水平对齐方式
    text-align: center,
    // {String} 定义弹性垂直对齐方式
    vertical-align: center
) !default;

// Element loading(7)
$loading: (
    // {Length} 菊花大小
    ico-size:     .5rem,
    // {Color} 菊花颜色
    ico-color:    #212121,
    // {Color} mask颜色
    mask-bgcolor: rgba(0, 0, 0, .1),
    // {Color} 背景颜色
    bgcolor:      null,
    // {Length} 字号
    font-size:    .14rem,
    // {Color} 文本颜色
    color:        map-get($base, color),
    // {String} loading的ico编码，自定义的webfont
    content:      "\f089"
) !default;

// Element Input(8)
$input: (
    // {Length} 输入框宽度
    width:             100%,
    // {Length} 输入框高度
    height:            .44rem,
    // {Length} 输入框内补白
    padding:           .1rem,
    // {Length} 输入框圆角
    radius:            .02rem,
    // {Color} 输入框边框色
    bordercolor:       map-get($base, bordercolor),
    // {Color} 输入框背景色
    bgcolor:           transparent,
    // {Color} 文本色
    color:             map-get($base, color),
    // {Color} 占位符颜色
    placeholder-color: #bbb
) !default;

// Element Button(18)
$btn: (
    // {Color} Length
    border-width:   1px,
    // {Color} 边框色
    bordercolor:    #e26704,
    // {Color} 背景色
    bgcolor:        #ff801a,
    // {Color} 文本色
    color:          #fff,
    // {Color} 激活时边框色
    active-bordercolor: null,
    // {Color} 激活时背景色
    active-bgcolor:     null,
    // {Color} 激活时文本色
    active-color:       null,
    // {Length} 内补白(使用em让根据字号动态调整)
    padding:        0 1.2em,
    // {Length} 圆角半径
    radius:         .02rem,
    // {Length} 字号
    font-size:      null,
    // {Length} 宽度
    width:          null,
    // {Length} 高度
    height:         null,
    // {Length} 默认预设3种尺寸按钮：
    // small
    s-height:       .28rem,
    s-font-size:    .12rem,
    // medium
    m-height:       .36rem,
    m-font-size:    .14rem,
    // large
    l-height:       .44rem,
    l-font-size:    .16rem
) !default;

// Element UI badge(7)
$badge: (
    // {Length} 内补白
    padding:      0 .03rem,
    // {Color} 边框厚度
    border-width: 1px,
    // {Color} 边框色
    bordercolor:  #f00,
    // {Color} 背景色
    bgcolor:      #f00,
    // {Color} 文本色
    color:        #fff,
    // {Number} 圆角
    radius:       .1rem,
    // {Length} 字号
    font-size:    .12rem
) !default;

// Element checked(11)
$checked: (
    // {String} 选中标记的内容，可以是自定义的webfont
    content:        "\f078",
    // {Length} 元件大小
    size:           .2rem,
    // {Length} 标签大小
    font-size:      .12rem,
    // {Length} 边框厚度
    border-width:   null,
    // {Color} 未选中时的边框色
    bordercolor:    null,
    // {Color} 未选中时的背景色
    bgcolor:        null,
    // {Color} 未选中时的标记颜色
    color:          transparent,
    // {Color} 激活边框色
    on-bordercolor: null,
    // {Color} 激活背景色
    on-bgcolor:     null,
    // {Color} 激活标记颜色
    on-color:       #2b94ff,
    // {Length} 圆角
    radius:         .05rem
) !default;

// Element range(3)
$range: (
    // {Color} 已选择区域的滑轴背景色
    inner-bgcolor: #444,
    // {Color} 未选择区域的滑轴背景色
    outer-bgcolor: #ccc,
    // {Color} 滑块色
    ball-color:    #fff
) !default;

// Element loadtip(3)
$loadtip: (
    // {Color} 文本色
    color: #666,
    // {Length} 字号
    font-size: .14rem,
    // {Color} ico色
    ico-color: map-get($base, link-color)
) !default;

// Widget UI score(3)
$score: (
    // {Length} 单项宽度
    item-width:  .16rem,
    // {Length} 单项高度
    item-height: .12rem,
    // {String} 图片URL
    url:    "star.png"
) !default;

// Fragment btnbar(1)
$btnbar: (
    // {auto | Length} 工具栏圆角
    // 当值为auto时，btnbar的圆角半径取决于按钮的圆角定义
    radius: auto
) !default;

// Fragment list(14)
$list: (
    // {Length} 列表外边距
    margin:            null,
    // {Length} 列表圆角
    radius:            null,
    // {Length} 列表边框厚度
    border-width:      null,
    // {Color} 列表边框色
    bordercolor:       map-get($base, bordercolor),
    // {Length} 列表项内补白，列表项有最小高度.44rem
    item-padding:      .11rem .1rem .12rem,
    // {Length} 列表组头内补白
    label-padding:     .03rem .1rem,
    // {Color} 列表组头背景色
    label-bgcolor:     map-get($base, bgcolor),
    // {Color} 点击反馈背景色
    active-bgcolor:    #f8f8f8,
    // {Color} 选中背景色
    on-bgcolor:        null,
    // {Color} 选中文本色
    on-color:          null,
    // {Color} 列表项边框色
    item-bordercolor:  map-get($base, sub-bordercolor),
    // {Color} 列表项组名边框色
    label-bordercolor: #eee,
    // {Length} 列表项字号
    item-font-size:    .14rem,
    // {Length} 列表组头字号
    label-font-size:   .13rem,
    // {Length} 列表项下边线距离左侧的间隙
    item-border-space: .1rem
) !default;

// Widget tab(14)
$tab: (
    // {Length} 组件高度
    height:             .44rem,
    // {Length} 圆角半径
    radius:             null,
    // {Length} 边框厚度
    border-width:       1px 0 0 0,
    // {Color} 边框色
    bordercolor:        map-get($base, bordercolor),
    // {Color} tab背景色
    bgcolor:            #fafafa,
    // {Color} tab文本色
    color:              map-get($base, sub-color),
    // {Color} tab激活背景色
    on-bgcolor:         null,
    // {Color} tab激活文本色
    on-color:           #00bec8,
    // {Length} 文本大小
    font-size:          .14rem,
    // {Length} 水平ico大小
    x-ico-size:         .12rem,
    // {Length} 垂直ico大小
    y-ico-size:         .2rem,
    // {Length} only ico大小
    only-ico-size:      .28rem,
    // {Color} item间隔线高度
    item-border-height: 100%,
    // {Color} item间隔线颜色
    item-bordercolor:   transparent
) !default;

// Fragment Table(10)
$table: (
    // {Length} 表头部内补白
    width:               100%,
    // {Boole} 是否需要纵向边框
    has-vertical-border: false,
    // {Length} 表头部内补白
    thead-padding:       .05rem .1rem,
    // {Length} 表主体内补白
    tbody-padding:       .1rem,
    // {Color} table边框色，表格必须有边框，所以不能有null值
    bordercolor:         map-get($base, bordercolor),
    // {Color} 表头部背景色
    thead-bgcolor:       #eee,
    // {Color} 表主体奇数行背景色
    odd-bgcolor:         null,
    // {Color} 表主体偶数行背景色
    even-bgcolor:        null,
    // {Color} 表主体激活行背景色
    active-bgcolor:      null,
    // {Color} 表主体选中行背景色
    on-bgcolor:          null
) !default;

// Fragment header(11)
$header: (
    // {Length} 高度
    height:         .44rem,
    // {Length} 两侧的子项宽度
    item-width:     .6rem,
    // {Length} 两侧的子项离边界的间隙
    item-space:     .15rem,
    // {Color} 边框色
    bordercolor:    #1ba9ba,
    // {Color} 背景色
    bgcolor:        #1ba9ba,
    // {Color} 文本色
    color:          #fff,
    // {Length} 文本大小
    font-size:      .18rem,
    // {Color} 文本色
    item-color:     null,
    // {Length} 两侧的子项ico颜色
    item-ico-color: #7ff,
    // {Length} 两侧的子项文本大小
    item-font-size: .14rem,
    // {Length} 两侧的子项ico大小
    item-ico-size:  .2rem
) !default;

// Widget switch(5)
$switch: (
    // {Color} 激活边框色
    checked-bordercolor: #4bd763,
    // {Color} 激活背景色
    checked-bgcolor:     #4bd763,
    // {Color} 边框色
    bordercolor:         map-get($base, bordercolor),
    // {Color} 背景色
    bgcolor:             map-get($base, bgcolor),
    // {Color} 滑块色
    ball-color:          #fff
) !default;

// Widget index(3)
$index: (
    // {Length} 索引宽度
    width:     .3rem,
    // {Color} 文本色
    color:     #555,
    // {Length} 索引字号
    font-size: .12rem
) !default;

// Widget group(1)
$group: (
    // {Length} group顶部偏移值
    top: 0
) !default;

// Widget suggest(15)
$suggest: (
    // {Length} 输入框高度
    height:           .3rem,
    // {Length} 搜索区文字大小
    font-size:        .14rem,
    // {Length} 搜索区内补白
    op-padding:       .1rem,
    // {Length} 输入框圆角
    radius:           .05rem,
    // {Color} 边框色
    bordercolor:      map-get($base, bordercolor),
    // {Color} 输入框背景色
    bgcolor:          map-get($base, bordercolor),
    // {Color} 输入框文本色
    color:            map-get($base, color),
    // {Color} 激活边框色
    on-bordercolor:   null,
    // {Color} 激活背景色
    on-bgcolor:       null,
    // {Color} placeholder文本色
    placeholder-color:#fff,
    // {Color} 操作区图标颜色
    ico-color:        #999,
    // {Color} 取消按钮颜色
    cancel-color:     map-get($base, link-color),
    // {Color} 搜索区背景色
    op-bgcolor:       #fff,
    // {Color} mask背景色
    mask-bgcolor:     #fff,
    // {Length} 取消按钮区域宽度
    cancel-width:     .7rem
) !default;

// Widget UI Dialog(11)
$dialog: (
    // {Length | null} 宽度
    width:           null,
    // {Length} 高度
    height:          3rem,
    // {Length} 圆角
    radius:          .05rem,
    // {Number} 阴影透明度(如果不想使用阴影，值为0)
    shadow-opacity:  .5,
    // {Color} 边框色
    bordercolor:     map-get($base, bordercolor),
    // {Length} 头部高度
    hd-height:       .44rem,
    // {Color} 头部背景色
    hd-bgcolor:      white,
    // {Color} 标题颜色
    title-color:     map-get($base, color),
    // {Length} 标题文字大小
    title-font-size: .16rem,
    // {Length} 主体区域间隙
    bd-padding:      .16rem .1rem .15rem,
    // {Length} 主体区域文字大小
    bd-font-size:    .16rem
) !default;

// Widget UI Popup(11)
$popup: (
    // {Length | null} 宽度
    width:           null,
    // {Length} 高度
    height:          3rem,
    // {Length} 圆角
    radius:          .03rem,
    // {Number} 阴影透明度(如果不想使用阴影，值为0)
    shadow-opacity:  .5,
    // {Color} 边框色
    bordercolor:     map-get($base, bordercolor),
    // {Length} 头部高度
    hd-height:       .5rem,
    // {Color} 头部背景色
    hd-bgcolor:      #eee,
    // {Color} 标题颜色
    title-color:     map-get($base, color),
    // {Length} 标题文字大小
    title-font-size: .16rem,
    // {Length} 主体区域间隙
    bd-padding:      .1rem,
    // {Length} 箭头大小
    arrow-size:      .12rem
) !default;

// Widget UI Tip(4)
$tip: (
    // {Length} 内补白
    padding: .06rem .15rem,
    // {Length} 圆角
    radius:  .05rem,
    // {Color} 背景色
    bgcolor: #000,
    // {Color} 文本色
    color:   #fff
) !default;

// Widget UI select(3)
$select: (
    // {Length} 默认显示几个列表项
    item:        5,
    // {Length} 每个列表项的高度
    item-height: .3rem,
    // {Color} 边框色
    bordercolor: map-get($base, bordercolor),
) !default;

// Widget UI number(7)
$number: (
    // {Length} 宽度
    width:               1.2rem,
    // {Length} 高度
    height:              .36rem,
    // {Color} 边框色
    bordercolor:         map-get($base, bordercolor),
    // {color} 输入框文本色
    color:               map-get($base, color),
    // {Color} 加减号背景色
    sign-bgcolor:        map-get($base, bgcolor),
    // {Color} 加减号文本色
    sign-color:          #999,
    // {Color} 禁用加减号文本色
    disabled-sign-color: map-get($base, disabled-color)
) !default;

// Widget UI switchable(9)
$switchable: (
    // {Boolen} 是否有按钮
    has-btn:            false,
    // {Length} 按钮大小
    btn-size:           .44rem,
    // {Color} 按钮背景色
    btn-bgcolor:        rgba(#09a5c4, .8),
    // {Color} 按钮文本色
    btn-color:          #fff,
    // {Color} 按钮按下时背景色
    btn-active-bgcolor: rgba(#09a5c4, .5),
    // {Color} 按钮按下时文本色
    btn-active-color:   null,
    // {Length} 索引大小
    index-size:         .1rem,
    // {Color} 索引背景色
    index-bgcolor:      #85c8d1,
    // {Color} 索引的当前项背景色
    index-on-bgcolor:   #09a5c4
) !default;

// Widget UI mask(1)
$mask: (
    // {Color} 背景色
    bgcolor: #fff
) !default;

// Widget UI slidermenu(1)
$slidermenu: (
    // {Length} action 宽度
    action-width: 1rem,
    // {Color} action 背景色
    action-bgcolor: #eee
) !default;

// Widget UI rating(3)
$rating: (
    // {Length} 单项宽度
    item-width:  .24rem,
    // {Length} 单项高度
    item-height: .18rem,
    // {String} 图片URL
    url:    "star.png"
) !default;

// Widget UI dblist(1)
$dblist: (
    // {Length} 导航panel宽度
    aside-width: null,
    // {Length} 导航panel顺序，从0开始
    aside-order: null
) !default;

// Widget UI datepicker(25)
$datepicker: (
    // {Length} 星期bar高度
    week-bar-height:      .22rem,
    // {Color} 星期bar背景色
    week-bar-bgcolor:     #1ba9ba,
    // {Color} 星期bar文本色
    week-bar-color:       #fff,
    // {Length} 星期bar字号
    week-bar-font-size:   .12rem,

    // {Length} 月份bar高度
    month-bar-height:     .25rem,
    // {Color} 月份bar边线色
    month-bar-bordercolor: #ddd,
    // {Color} 月份bar背景色
    month-bar-bgcolor:     #f9f9f9,
    // {Color} 月份bar文本色
    month-bar-color:       #000,
    // {Length} 月份bar字号
    month-bar-font-size:   .14rem,

    // {Length} 每行高度
    week-height:           .54rem,
    // {Color} 每行边线色
    week-bordercolor:       #ddd,
    // {Color} 每行文本色
    week-color:             #000,

    // {Length} 每日高度
    day-height:            .24rem,
    // {Length} 每日间距
    day-margin:            .05rem 0 .02rem,
    // {Length} 每日圆角
    day-radius:            50%,
    // {Length} 每日字号
    day-font-size:         .14rem,

    // {color} 特殊日文本色
    special-color:         #f50,
    // {color} 周末文本色
    weekend-color:         #f00,
    // {color} 禁用日子文本色
    disabled-color:        gray,

    // {color} 选中日期背景色
    on-bgcolor:            #1ba9ba,
    // {color} 选中日期文本色
    on-color:              #fff,
    // {color} 选中日期提示语文本色
    on-tip-color:          #1ba9ba,
    // {Length} 选中日期提示语字号
    on-tip-font-size:      .14rem,

    // {String} 开始日期提示语
    start-content:         "入店",
    // {String} 结束日期提示语
    end-content:           "离店"
) !default;

// z-index
$z-index: (
    // {Number} 下拉菜单层级范围50-100
    dropdown: 50,
    // {Number} 遮罩层级
    mask:     1000,
    // {Number} 弹窗层级范围1001-2000
    dialog:   1001,
    // {Number} 浮层层级范围2001-2500
    popup:    2001,
    // {Number} 搜索层级范围2501-3000
    suggest:  2501,
    // {Number} 浮层层级范围3001-4000
    tip:      3001,
    // {Number} loading层级
    loading:  9999
) !default;
